<template>
  <div>
      <ul>
          <li>账号: <input type="text" v-model="formdata.zhanghao"></li>
          <li>密码: <input type="password" v-model="formdata.password"></li>
          <li>
            性别: 男<input type="radio" name="xingbie" v-model="formdata.gender" value="male"> 
            女:<input type="radio" name="xingbie" v-model="formdata.gender" value="female">
          </li>
          <li>
            爱好: 抽烟: <input type="checkbox" v-model="formdata.hobby" value="chouyan">
            喝酒: <input type="checkbox" v-model="formdata.hobby" value="drink">
            烫头: <input type="checkbox" v-model="formdata.hobby" value="tangtou">
          </li>
          <li>
            所属校区: <select v-model="formdata.school">
              <option value="">选择所属校区</option>
              <option value="beijing">北京</option>
              <option value="shanghai">上海</option>
              <option value="shenzhen">深圳</option>
              <option value="wuhan">武汉</option>
            </select>
          </li>
          <li>其他信息: <textarea v-model="formdata.qita"></textarea></li>
          <li><input type="checkbox" v-model="formdata.agree">阅读并接受<a href="www.baidu.com">用户协议</a></li>
          <li><input type="submit" value="提交" @click="tijiao"></li>
      </ul>
  </div>
</template>

<script>
  export default {
    name:'Register',
    data(){
      return{
        formdata:{
          zhanghao:'',
          password:'',
          gender:'male',
          hobby:[],
          school:'',
          qita:'',
          agree:''
        },
      }
    },
    methods: {
      tijiao(){
        console.log(this.formdata)
      }
    },
  }
</script>

<style scoped>
  ul li{
      list-style: none;
      padding: 5px;
  }
</style>